<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="bootstrap/css/bootstrap.min.css" rel="stylesheet">
<link href="bootstrap/css/bootstrap-responsive.min.css" rel="stylesheet"
	media="screen">
<link href="bootstrap/css/doc.css" rel="stylesheet">
<link href="bootstrap/css/prettify.css" rel="stylesheet">
<style type="text/css">
td {
	text-align: center;
}

body {
	padding-bottom: 40px;
}

.form-signin {
	padding: 19px 29px 29px;
	margin: 0 auto 20px;
	background-color: #fff;
	border: 1px solid #e5e5e5;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	-webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .05);
	-moz-box-shadow: 0 1px 2px rgba(0, 0, 0, .05);
	box-shadow: 0 1px 2px rgba(0, 0, 0, .05);
	text-align: right;
}

.form-signin .form-signin-heading,.form-signin .checkbox {
	margin-bottom: 10px;
}

.form-signin input[type="text"],.form-signin input[type="password"] {
	font-size: 16px;
	height: auto;
	margin-bottom: 15px;
	padding: 7px 9px;
	max-width: 300px;
}

.table-tete {
	background-color: #f5f5f5;
}

.button-nav {
	margin-right: 1em;
}

.login {
	float: right;
}

.form-nav {
	margin: 0;
}

.page-header h2 {
	display: inline-block;
}

.form-match {
	display: inline-block;
	margin: 0;
	margin-left: 40%;
}

.right {
	margin-right: 1em;
}

.form-content {
	text-align: left;
}

.image-button {
	border: 1px solid #CECBCB;
	border-radius: 11%;
	width: 100px;
}

.image-button:hover {
	border: 2px solid black;
}

.span9 {
	margin-top: 40px;
}

.image-group-button {
	margin-bottom: 30px;
}
</style>

<title>Tournoi de foot - Arbitres</title>
</head>
<body>
	<!-- Navbar
    ================================================== -->
	<div class="navbar navbar-inverse navbar-fixed-top">
		<div class="navbar-inner">
			<div class="container">
				<button type="button" class="btn btn-navbar" data-toggle="collapse"
					data-target=".nav-collapse">
					<span class="icon-bar"></span> <span class="icon-bar"></span> <span
						class="icon-bar"></span>
				</button>
				<div class="nav-collapse collapse">
					<ul class="nav">
						<li class="active"><a href="admin">Accueil</a></li>
					</ul>


					<form class="form-nav" method="POST" action="admin?action=logout">
						<input type="submit" class="btn btn-danger login" value="Log out" />
					</form>


				</div>
			</div>

		</div>
	</div>
	<!--  ==================================================  Navbar -->

	<!-- Subhead
================================================== -->
	<header class="jumbotron subhead" id="overview">
	<div class="container">
		<h1>Attribution des arbitres</h1>
		<p class="lead">Attribuez un arbitre à chaque match</p>
		<div id="carbonads-container"></div>
	</div>
	</header>
	<!--  ==================================================  Subhead -->

	<div class="container">
		<div class="span9">
			<div class="image-group-button">

				<a href="admin"> <img class="image-button"
					src="images/homeblanc.png" />
				</a> <a href="admin?action=inscrire-arbitres"> <img
					class="image-button" src="images/sifflet.png" />
				</a><a href="admin?action=affecter-arbitres"> <img
					class="image-button" src="images/arbitre.png" />
				</a> <a href="admin?action=gerer-matchs"> <img class="image-button"
					src="images/gestionmatch.png" />
				</a>


			</div>

			<table class="table table-bordered">
				<thead class="table-tete">
					<tr>
						<td colspan="2"><b>Arbitres</b></td>
					</tr>
				</thead>
				<tbody>
					<c:forEach var="arbitre" items="${sessionScope.arbitres}">
						<tr>
							<td><c:out value="${arbitre.nom}" /></td>
							<td><c:out value="${arbitre.prenom}" /></td>
						</tr>
					</c:forEach>
				</tbody>
			</table>


			<c:forEach var="tour" items="${sessionScope.tours}">
				<c:if test="${tour.numero !=  sessionScope.tours.size()}">
				<form method="POST" action="admin">
					<input type="hidden" name="action"
						value="affecter-arbitres-reponse">
					<table class="table table-bordered">

						<thead class="table-tete">
							<tr>
								<td colspan="3">Tour n°<c:out value="${tour.numero}" /></td>
							</tr>
						</thead>

						<tbody>
							<c:forEach var="match" items="${tour.matchDuTour}">

								<c:if
									test="${match.domicile != null && match.exterieur != null}">
									<tr>
										<td><c:out value="${match.domicile.nom}" /></td>
										<td><c:out value="${match.exterieur.nom}" /></td>

										<td><c:if test="${match.arbitre == null}">
												<select name="arbitre_${tour.numero}_${match.id}"
													class="match_arbitres" tour="${tour.numero}"
													match="${match.id}">

													<option>-</option>
													<c:forEach var="arbitre" items="${sessionScope.arbitres}">
														<option value="${arbitre.id}">
															<c:out value="${arbitre.prenom}" />
															<c:out value="${arbitre.nom}" />
														</option>


													</c:forEach>

												</select>
											</c:if> <c:if test="${match.arbitre != null}">
												<c:out value="${match.arbitre.nom}" />
												<c:out value="${match.arbitre.prenom}" />
											</c:if></td>

									</tr>
								</c:if>
							</c:forEach>
							<tr>
								<input type="submit" class="btn" value="Assigner ces arbitres" />
							</tr>
						</tbody>
					</table>
				</form>
				</c:if>
			</c:forEach>
		</div>
	</div>
	<!-- Footer
    ================================================== -->
	<footer class="footer">
	<div class="container">
		<p>Designed and built by Kévin De Jesus Ferreira, Florent
			Champigny & Julien Mialon</p>
		<p>Projet Etudes AAR - Master 2 Informatique Orléans</p>
	</div>
	</footer>
	<!--  ==================================================  Footer -->
</body>
<script src="http://code.jquery.com/jquery.js"></script>
<script src="bootstrap/js/bootstrap.min.js"></script>

<script>
	$(".match_arbitres").change(
			function() {
				var numero_tour = $(this).attr("tour");
				var id_arbitre = $(this).val();
				$(".match_arbitres[tour='" + numero_tour + "']").not(this)
						.find("option[value='" + id_arbitre + "']").remove();

				$(this).attr("disabled", 'disabled');
			});
	jQuery(function($) {

		$('form').bind('submit', function() {
			$(this).find(':input').removeAttr('disabled');
		});

	});
</script>

</html>